<template>
  <div>
    <h2>用户借款列表</h2>
    借款名称 <input type="text" v-model="data.B_name">
    利息 <select  v-model="data.I_id" >
            <option value="0">--请选择--</option>
            <option v-for="i in list" :value="i.I_id">{{ i.I_name }}</option>
          </select>&nbsp;
          <input type="button" value="查询" @click="show" class="btn btn-primary">&nbsp;
          <input type="button" value="倒叙" @click="wohs" class="btn btn-primary">
    <table class="table table-bordered">
      <tr>
        <td>借款ID</td>
        <td>借款名称</td>
        <td>借款最高金额</td>
        <td>借款年限</td>
        <td>利息</td>
        <td>借款简介</td>
        <td>借款发布时间</td>
      </tr>
      <tr v-for="item in valt">
        <td>{{ item.B_id }}</td>
        <td>{{ item.B_name }}</td>
        <td>{{ item.B_maxPrice }}</td>
        <td>{{ item.B_year }}</td>
        <td>{{ item.I_name}}</td>
        <td>{{ item.B_remark }}</td>
        <td>{{ item.B_Date.substr(0,10)}}</td>
      </tr>
    </table>
    <input type="button" @click="page(1)" value="首页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pageindex-1)" value="上一页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pageindex+1)" value="下一页" class="btn btn-primary">&nbsp;
    <input type="button" @click="page(data.pagecount)" value="尾页" class="btn btn-primary">
  </div>
</template>
<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';

const valt=ref([{
  B_id:0,
  B_name:'',
  B_maxPrice:0,
  B_year:0,
  I_id:'0',
  I_name:'',
  B_remark:'',
  B_Date:''
}])

 const data=ref({
  B_name:'',
  I_id:0,
  pageindex:1,
  pagesize:3,
  count:0,
  pagecount:0
 })

const list =ref([{
  I_id:0,
  I_name:''
}])

onMounted(()=>{
  BackFill1()
  show()
})

const page=(num:any)=>{
  if(num>=1&&num<=data.value.pagecount){
    data.value.pageindex=num
    show()
  }
}



const BackFill1=()=>{
  axios({
    url:'http://localhost:54566/api/Borrow/GetInverestBind',
    mathod:'get',
  })
  .then((res)=>{
    console.log(res.data)
    list.value=res.data
  })
  .catch((err)=>{
    console.log(err)
  })
}

const wohs=()=>{
  axios({
    url:'http://localhost:54566/api/Borrow/GetBorrowShowDesc',
    method:'get',
    params:{
      B_name:data.value.B_name,
      I_id:data.value.I_id,
      pageindex:data.value.pageindex,
      pagesize:data.value.pagesize
    }
  })
  .then((res)=>{
    console.log(res.data) 
    valt.value=res.data.pageorder
    data.value.count=res.data.count
    data.value.pagecount=res.data.pagecount
  })
  .catch((err)=>{
    console.log(err)
  })
}

const show=()=>{
  axios({
    url:'http://localhost:54566/api/Borrow/GetBorrowShow',
    method:'get',
    params:{
      B_name:data.value.B_name,
      I_id:data.value.I_id,
      pageindex:data.value.pageindex,
      pagesize:data.value.pagesize
    }
  })
  .then((res)=>{
    console.log(res.data) 
    valt.value=res.data.pageorder
    data.value.count=res.data.count
    data.value.pagecount=res.data.pagecount
  })
  .catch((err)=>{
    console.log(err)
  })
}
</script>